import cn from "classnames";
import type { SetupContext, SlotsType, StyleValue } from "vue";
import styles from "./Card.module.css";

type CardProps = {
  style?: StyleValue;
  class?: any;
};

type CardSlots = {
  default: () => unknown;
  title: () => unknown;
};

export default function Card(p: CardProps, ctx: SetupContext<[], SlotsType<CardSlots>>) {
  return (
    <div class={cn(styles.card, p.class)} style={p.style}>
      <div class={styles["card-title"]}>{ctx.slots.title?.()}</div>
      <div class={styles["card-content"]}>{ctx.slots.default?.()}</div>
    </div>
  );
}
